<template>
  <div class="container">	
	  
	<el-row :gutter="10" style="margin-left:20px;margin-top:20px;">
		  <el-col :span="4">
		  
			<el-card class="square-card" style="background-color: #409EFF;box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);border-radius: 30px">  
				<div slot="header" class="clearfix" >  
				  <span>职位总数</span>  
				</div>
				<div>  
				  {{obj.pos_num}} 
				</div> 
			 </el-card>
			 
		  </el-col>
		  <el-col :span="4">
		  
			<el-card class="square-card" style="background-color: #67C23A;box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);border-radius: 30px">  
				<div slot="header" class="clearfix" >  
				  <span>入驻企业总数</span>  
				</div>
				<div>  
				  {{obj.company_num}} 
				</div> 
			 </el-card>
			 
		  </el-col>
	 
	  </el-row>
	  <el-row :gutter="10" style="margin-left:20px;margin-top:20px;">

		  <el-col :span="4">
		  
			<el-card class="square-card" style="background-color: #E6A23C;box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);border-radius: 30px">  
				<div slot="header" class="clearfix" >  
				  <span>企业招聘者总数</span>  
				</div>
				<div>  
				  {{obj.hr_num}} 
				</div> 
			 </el-card>
			 
		  </el-col>
		  <el-col :span="4">
		  
			<el-card class="square-card" style="background-color: #F56C6C;box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);border-radius: 30px">  
				<div slot="header" class="clearfix" >  
				  <span>应聘者总数</span>  
				</div>
				<div>  
				  {{obj.user_num}} 
				</div> 
			 </el-card>
			 
		  </el-col>
	  	</el-row>
	
  </div>

  
</template>

<style scoped>  
.square-card {  
  width: 200px; /* 定义宽度 */  
  height: 200px; /* 定义高度 */  
  border-radius: 20; /* 移除圆角 */  
}  
</style>

<script>
import { FriLink } from '@/model/friLink'

import * as echarts from 'echarts';

export default {
  data() {
    return {
      loading: false,
	  obj:Object
    }
  },
  
  name: "chart",
  props: {
    //chartId: "aaaaa",
    xData: Array,
    // itemData: Array,
    series: Array,
    legend: Object
  },
  
  watch: {
    // xData: function(val){
    //   this.renderChart();
    // },
    series: function(val) {
      this.renderChart();
    }
  },
  mounted() {
    this.drawLine();
	// setTimeout(() => {
  //         this.drawLine();
  //   }, 5200)
  },
  
  methods: {
	
	// 渲染折线图
	async drawLine () {

			const obje = await FriLink.total()
			
			//{"id":null,"pos_num":55,"company_num":22,"hr_num":10,"user_num":3}
			
			console.info(222)
				console.info(obje)
			console.info(222)
			
			this.obj=obje;
		
			
        }
  
  
  },
}
</script>

<style lang="scss" scoped>

</style>
